<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    .instant-link {
  height: 700px;
  display: flex;
  justify-content: space-between;
  padding-left: 35px;
  padding-right: 35px;
  font-size: 20px;
  font-family: "思源黑体 CN Regular", "思源黑体 CN";
  color: rgb(102, 102, 102);
    margin-top: 5%;
}
.instant-link-title {
    margin-bottom: 10px;
  }
.command-centre img {
    width: 630px;
    height: 380px;
}
.command-centre-list {
  display: flex;
}
.command-centre-list   img {
    width: 300px;
    height: 200px;
  }
.command-centre-one {
  margin-right: 20px;
}
.vehicle  img {
    width: 430px;
    height: 270px;
}
.vehicle-list {
  display: flex;
}
.vehicle-list   img {
    width: 210px;
    height: 140px;
  }
.instant-link-footer {
  text-align: center;
}
.instant-link-footer img {
    width: 35px;
    height: 35px;
    vertical-align: middle;
  }
.end-conversation {
  width: 160px;
  margin: 0 auto;
  height: 65px;
  font-size: 16px;
  cursor: pointer;
}
.vehicle-row {
  margin-bottom: 10px;
}
</style>
<body>
    <div>
        <div class="instant-link">
          <div>
            <el-row class="instant-link-title">指挥中心</el-row>
            <el-row class="command-centre">
              <img src="../public/img/u95103.png" alt="" />
            </el-row>
            <el-row class="command-centre-list">
              <div class="command-centre-one">
                <div>指挥所1</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
              <div class="">
                <div>指挥所2</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
            </el-row>
          </div>
          <div>
            <el-row class="vehicle-row">车载</el-row>
            <el-row class="vehicle">
              <img src="../public/img/u95109.png" alt="" />
            </el-row>
            <el-row class="vehicle-list">
              <div class="command-centre-one">
                <div>单兵A</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
              <div class="">
                <div>单兵B</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
            </el-row>
            <el-row class="vehicle-list">
              <div class="command-centre-one">
                <div>单兵A</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
              <div class="">
                <div>单兵B</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
            </el-row>
          </div>
          <div>
            <el-row class="vehicle-row">无人机</el-row>
            <el-row class="vehicle">
              <img src="../public/img/u95111.png" alt="" />
            </el-row>
            <el-row class="vehicle-list">
              <div class="command-centre-one">
                <div>单兵A</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
              <div class="">
                <div>单兵B</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
            </el-row>
            <el-row class="vehicle-list">
              <div class="command-centre-one">
                <div>单兵A</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
              <div class="">
                <div>单兵B</div>
                <img src="../public/img/u95105.png" alt="" />
              </div>
            </el-row>
          </div>
        </div>
        <div class="instant-link-footer">
            <!-- @click="instantLinkShow = false" -->
          <div class="end-conversation" >
            <img src="../public/img/u95142.png" alt="" />
            结束通话
          </div>
        </div>
    </div>
</body>

</html>